<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
	<head th:replace="weixin/_fragments :: head(~{::title})">
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>发布会以</title>
		<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
		<link rel="stylesheet" href="../../static/css/bootstrap.min.css"/>
		<link rel="stylesheet" href="../../static/lib/bootstrapValidator/css/bootstrapValidator.min.css"/>
	</head>
	<body style="background-color: #31B0D5;">
		<div class="container"> 
			<div style="margin-left: 8rem;">
				<ul class="nav nav-tabs">
				  <li role="presentation" class="active"><a href="#" th:href="@{/weixin/publish}">发布讲座</a></li>
					<li role="presentation"><a href="#" th:href="@{/meetingPublish/published(uid=${uid})}">已发布讲座</a></li>
				</ul>
			</div>
			<div class="container" style="margin-top: 3.125rem;">
				<form>
					<input type="hidden" name="uid" th:value="${uid}">
				    <div class="form-group">
						<label for="mtime">讲座时间</label>
						<div class="input-group">
							<input type="text" id="mtime" name="mtime" class="form-control" placeholder="2019/03/01 08:30"  aria-describedby="basic-addon1"/>
							<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
						</div>
					</div>
					<div class="form-group">
						<label for="mtitle">讲座讲题</label>
						<input type="text" id="mtitle" name="mtitle" class="form-control" placeholder="量子力学">
					</div>
					<div id="mtypes" th:fragment="mtypes"  class="form-group">
						<label>讲座类别</label>
						<select id="tid" name="tid" style="height: 3.125rem;">
							<option value="-1" selected="selected">--请选择--</option>
							<option th:each="mt : ${meetingTypes}" th:value="${mt.id}">[[${mt.tname}]]</option>
							<!--/*-->
							<option value="1">数学领域</option>
							<option valu="2">物理领域</option>
							<option value="3">计算机领域</option>
							<option value="4">生物领域</option>
							<!--*/-->
						</select>
					</div>
					<div class="form-group">
						<label>需求讲者区域</label>
						<select name="zone" style="height: 3.125rem;">
							<option value="东区" selected="selected">东区</option>
							<option valu="南区">南区</option>
							<option value="西区">西区</option>
							<option value="北区">北区</option>
							<option value="全国">全国</option>
						</select>
					</div>
					<div class="form-group">
						<textarea rows="3" cols="40" name="remark" placeholder="备注（120字以内）"></textarea>
					</div>
				    <div class="text-center" style="margin-top: 3.125rem;">
					    <button type="button" id="submit" class="btn btn-primary" style="width: 100%;">发布</button>
				    </div>
				</form>
			</div>

			<div id="modal01" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog">
				<div class="modal-dialog modal-sm" role="document">
					<div class="modal-content">
						<strong>提示：</strong></br>
						<p>网络异常请稍后重试！</p>
					</div>
				</div>
			</div>
			<div id="modal02" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog">
				<div class="modal-dialog modal-sm" role="document">
					<div class="modal-content">
						<strong>提示：</strong></br>
						<p>发布成功</p>
					</div>
				</div>
			</div>
		</div>

		<!--/*/<th:block th:replace="weixin/_fragments :: script">/*/-->
		<script src="../../static/jquery/jquery-3.4.1.min.js" type="text/javascript"></script>
		<script src="../../static/js/bootstrap.min.js" type="text/javascript"></script>
		<script src="../../static/lib/bootstrapValidator/js/bootstrapValidator.min.js" type="text/javascript"></script>
		<script src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js" type="text/javascript"></script>
		<!--/*/</th:block>/*/-->
		<script>
			$(function () {
				/*表单验证的初始化*/
				$('form').bootstrapValidator({
					fields: {
						mtime: {
							validators: {
								notEmpty: {
									message: '讲座时间不能为空'
								},
								date: {
									format: 'YYYY/MM/DD HH:mm',
									message: '时间格式不对(例:2010/12/23 15:30)'
								}
							}
						},
						mtitle: {
							validators: {
								notEmpty: {
									message: '讲座主题不能为空'
								}
							}
						},
						tid: {
							validators: {
								callback: {
									message: '必须选择一个讲座类别',
									callback: function (value, validator) {
										if (value == -1) { //-1是--请选择--选项
											return false;
										} else {
											return true;
										}
									}
								}
							}
						}
					}
				});
				$('#mtypes').load(/*[[@{/meetingType/findAll(target=publish)}]]*/ "/meetingType/findAll?target=publish");
			});

			// 提交时验证
			$('#submit').click(function () {
				var bootstrapValidator = $('form').data('bootstrapValidator');
				// 提交时验证
				bootstrapValidator.validate();
				if (bootstrapValidator.isValid()) {
					var url = "/meetingPublish/publish"
					var data = $('form').serialize();
					$.post(url, data, function (msg) {
						if (msg == "1") {
							$("#modal01").modal("show"); // 发布失败
						} else if (msg == "2") {
							$("#modal02").modal("show"); // 发布成功
						}
					})
				}
				return false;
			});
		</script>
	</body>
</html>
